//这是“活动公告”less文件

//1.引入css文件
@import "reset.css";
@import "scroll.css";
@font-size:100rem;
//2.基础代码块
html{
  font-size: 13.33vw;
}
*{
  box-sizing: border-box;
}
.clearfix:after,.clearfix:before{
  content: '';
  display: block;
  clear: both;
}
.fr{
  float: right;
}
.fl{
  float: left;
}
html,body{
  width: 100%;
  height: 100%;
}
//3.自己的代码块
//设置整体样式
body{
  color: #5a5a5a;
  font-size: 26./@font-size;
  font-family: '微软雅黑';
}
//设置内容样式
.container{

  display: flex;
  flex-direction: column;
  width: 750./@font-size;
  height: 100%;
  margin: 0 auto;
  background-color: #f6f6f6;
  //设置顶部样式
  .header{
    width: 100%;
    height: 100./@font-size;
    background-color: #eee;
    padding: 24./@font-size 20./@font-size;
    a {
      display: flex;
      justify-content: space-between;
      p{
        .one{
          width: 32./@font-size;
          height: 32./@font-size;
        }
        color: #000;
        font-size: 36./@font-size;
        font-weight: 400;
      }
      .two{
        margin-top:23./@font-size ;
        width: 42./@font-size;
        height: 10./@font-size;
      }
    }
  }
  //设置中部样式
  .section{
    width: 100%;
    background-color: #f6f6f6;
    //头部和顶部的区域去除后所有的区域都是section的
    flex: 1;
    //将所有的滚动条隐藏
    //只显示y轴上的滚动条
    overflow: hidden;
    overflow-y: auto;
    //设置图片
    .banner{
      //padding-left:25./@font-size;
      //设置上下边距
      margin: 18./@font-size 0;
      img{
        width: 711./@font-size;
        height: 344./@font-size;
      }
    }
    //设置具体内容
    .content{
      padding-left: 20./@font-size;
      padding-right: 40./@font-size;
      .list{
        .item{
          margin-bottom: 42./@font-size;
          a{
            display: flex;
            justify-content: space-between;
              img{
                margin-right: 18./@font-size;
                width: 205./@font-size;
                height: 151./@font-size;
              }
            .right{
                h2{
                  font-size: 29./@font-size;
                  color: #282828;
                  font-weight: 400;
                }
              .time{
                font-size: 24./@font-size;
                color: #8c8c8c;
                font-weight: 400;
              }
              .word{
                color: #5a5a5a;
                font-size: 26./@font-size;
              }
            }
          }
        }
      }
    }

  }
  //设置底部样式
  .footer{
    width: 100%;
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    padding: 11./@font-size 62./@font-size 14./@font-size 56./@font-size;
    a{
      display: flex;
      flex-direction: column;
      align-items: center;
      &.active{
        p{
          color: #f84443;
        }
      }
      img{
        width: 37./@font-size;
        height: 42./@font-size;
      }
      p{
        color: #a4a4a4;
      }

    }
  }
}